---
import ContentFooterLink from './ContentFooterLink.astro'
import PencilIcon from '../../icons/pencil.svg'

interface Props {
  url: undefined | string
}

let { url } = Astro.props
---

{
  url && (
    <ContentFooterLink url={url}>
      <PencilIcon class="icon" slot="icon" />
      Edit this page
    </ContentFooterLink>
  )
}

<style>
  .icon {
    inline-size: var(--size-icon-s);
    block-size: var(--size-icon-s);
  }
</style>
